import IntegrationTable, {
	IntegrationTableProps,
} from "@/components/IntegrationTable";
import { ProColumns } from "@ant-design/pro-table";
import React, { useEffect } from "react";
import { DynamicFormItem } from "@/components/DynamicForm";

// @page 商家
const AppList: React.FC<any> = () => {
	// 组件是否已经卸载
	let isUnMounted = false;
	// 表格项
	const columns: ProColumns[] = [
		{
			title: "日期",
			dataIndex: "time",
			valueType: "dateRange",
			hideInTable: true,
			search: {
				transform: (value: any) => ({
					startTime: value[0],
					endTime: value[1],
				}),
			},
		},

		{
			title: "appKey",
			dataIndex: "appKey",
			search: false,
		},
		{
			title: "appSecret",
			dataIndex: "appSecret",
			search: false,
		},
		{
			title: "app名称",
			dataIndex: "appName",
			search: false,
		},
		{
			title: "app描述",
			dataIndex: "appDesc",
			search: false,
		},
		{
			title: "状态",
			dataIndex: "realDateStatus",
			search: false,
			valueEnum: {
				1: "启用",
				2: "禁用",
				"-1": "删除",
			},
		},
		{
			title: "创建时间",
			dataIndex: "createTime",
			search: false,
		},
	];

	const getFormItems = (vm: any, isEdit?: boolean): DynamicFormItem[] => {
		const { coupon } = vm.state;
		return [
			{
				type: "text",
				label: "应用简介",
				name: "appDesc",
				required: true,
			},
			{
				type: "text",
				label: "应用key",
				name: "appKey",
				required: true,
			},
			{
				type: "text",
				label: "应用名字",
				name: "appName",
				required: true,
			},
			{
				type: "text",
				label: "应用密钥",
				name: "appSecret",
				required: true,
			},
		];
	};

	// 一体化表格props
	const tablePorps: IntegrationTableProps = {
		rowKey: "id",
		scroll: { x: 1000 },
		columns,
		listProps: {
			url: "/app/list",
			method: "GET",
			requestType: "params",
			paramsHandle: (params: any) => {
				return {
					...params,
				};
			},
		},
		addProps: {
			url: "/app/add",
			method: "POST",
			paramsHandle: (params: any) => {
				return {
					...params,
				};
			},
			modalProps: {
				formProps: {
					labelCol: { span: 6 },
				},
				formItemsHandle: (_: any, vm: any) => {
					return getFormItems(vm);
				},
			},
		},
	};

	// 初始化加载数据
	useEffect(() => {
		return () => {
			isUnMounted = true;
		};
	}, []);

	return <IntegrationTable {...tablePorps} />;
};

export default AppList;
